<template>
    <div>
        <h1>活动管理列表</h1>
        名称：<input type="text" v-model="w.name">
        分类<select v-model="w.type">
                        <option value="">请选择</option>
                        <option value="文化娱乐">文化娱乐</option>
                        <option value="体育健身">体育健身</option>
                        <option value="商场活动">商场活动</option>
                        <option value="其他">其他</option>
                    </select>
        <input type="button" value="查询" class="btn btn-primary" @click="Show">
        <table class="table table-bordered">
            <tr>
                <td>活动信息</td>   
                <td>活动状态</td>      
                <td>分类</td>         
                <td>活动时间</td>             
                <td>活动地点</td>              
                <td>最后更新人</td>                         
                <td>最后更新时间</td>
                <td>操作</td>
            </tr>
            <tr v-for="item in list" >
                <td><img :src="item.photo" alt="" width="50px" height="50px">{{item.name}}</td>   
                <td>{{item.state==0?"进行中":"已结束"}}</td>      
                <td>{{item.type}}</td>         
                <td>{{item.startTime}}-{{item.endTime}}</td>             
                <td>{{item.add}}</td>              
                <td>{{item.lastPeople}}</td>                         
                <td>{{item.updateTime}}</td>
                <td>
                    <input type="button" value="报名信息" class="btn btn-primary" @click="Bao(item.id)" >
                    <input type="button" value="编辑" class="btn btn-primary" @click="Fan(item.id)">
                    <input type="button" value="删除" class="btn btn-primary" @click="Del(item.id)">
                </td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios';
import moment from 'moment';

let route = useRoute();
let router = useRouter();
let data: ant = reactive({
    w: {
        "name": "",
        "type": "",
    },
    list: [],
});
let { w, list} = toRefs(data);
onMounted(() => {
    Show();
})
const Show = () => {
    let obj = {
        name: w.value.name,
        type: w.value.type,
    }
    axios({
        url: '/api/ActClass/Alist',
        method: 'get',
        params: obj
    }).then((res) => {
       list.value= res.data.data
    })
}

//删除
const Del = (id: any) => {
    let res = confirm("确定删除吗？")
    let obj = {
        id: id
    }
    if (res) {
        axios({
            url: '/api/ActClass/Dell',
            method: 'delete',
            params: obj
        }).then((res) => {
            if (res.data.data == 1) {
                alert("删除成功")
                Show();
            }
            else {
                alert("删除失败")
                return;
            }
        })
    }
}

//反填跳转页面
const Fan = (id: any) => {
    router.push({
        path: '/aupd',
        query: {
            id: id
        }
    })
}
//反填跳转页面
const Bao = (id: any) => {
    router.push({
        path: '/look',
        query: {
            id: id
        }
    })
}
</script>

<style scoped>
span {
    color: red;
}
</style>